<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/WEB-INF/views/common/taglibs.jsp"%>
<%@taglib prefix="mac" tagdir="/WEB-INF/tags" %>

<mac:layoutPopup>
    <jsp:attribute name="scripts" >
        <script type="text/javascript">  
            
            
            
             function serializarForm(){
               //esta funcion serializa los inputs, se personaliza de esta forma para 
               //poder manejar la serializacion de algunos atributos particulares
               var object=$("#formulario").serializeObject();
               var archivosForm=$("#cargarArchivoForm").serializeObject();
               var lst=[];
               var form={};
               
               //console.log(object)
               $.each(object,function(v,k){
                   lst.push({nombre:v,valor:k});
               })
               $.each(archivosForm,function(v,k){
                   lst.push({nombre:v,valor:k});
               })
                              
               form.inputs=lst;
               return form;

           }
           
            //var estacionJSON='${estacionJSON}'//$.parseJSON('${estacionJSON}');
            //console.log(estacionJSON)
            var tiposDocumentoJSON=$.parseJSON('${tiposDocumentoJSON}');
            //console.log(tiposDocumentoJSON)
            	
            function subirArchivos(){                
                //console.log("enviando archivos...")
                var formObject = document.getElementById('cargarArchivoForm'),
                url = Tesis.contextPath + "/pages/modelador/load",
                callbackFn =  {
                    timeout: 40000,
                    upload: function(response) {                            
                        var resultado = $.parseJSON(response.responseText.replace(/<PRE>|<\/PRE>/gi,''));                            

                        if(resultado.error){
                             alert("error");
                        }else{
                            //console.log("envio correcto...")
                            enviarForm();
                        }

                    },
                    failure: function(response) {
                        alert('Error al subir archivos');
                        formObject.reset();
                        Tesis.loading.hide();
                    }
                };
                
                
                YAHOO.util.Connect.setForm(formObject,true);
                YAHOO.util.Connect.asyncRequest('POST', url, callbackFn);
      
            }    
            
            function enviarForm(){
                //console.log("enviando datos de formulario..")
                var datos = serializarForm();                  
                $.postJSON("metodo",datos,function(response){
                    if (!response.error){
                        //console.log(response)
                        $("#panelDatos").hide();        
                        mensajeExito("Proceso Correcto");
                        $("#panelResultados").show();
                        var html="<p>";
                        $.each(response.data.lstVarDTO,function(v,k){
                            html= html+"<b>"+k.nombre+": </b> "+k.valorVariable+"<br/>"
                        });
                        $.each(response.data.lstDocumentoDTO,function(v,k){
                            
                            if (k.idtipodocumentoDTO){
                                //console.log(k)
                                html= html+"<b>"+k.idtipodocumentoDTO.nombre+": </b> "+k.idtipodocumentoDTO.estadoDocumento.idestadodocumento+"<br/>"
                            }
                        });
                        
                        html= html+"</p>";
                        $("#resultado").html(html);
                    }else{
                         $("#panelDatos").hide();        
                         $("#panelResultados").show();
                         $("#resultado").html(response.error);
                    }
                }); 
            }
            
            $(document).ready(function(){
                $('#btnAceptar').click(function(){
                    $("#divButton").html("");
                    $("#divButton").removeClass("floatRight");
                    $("#divButton").html("<div class='circle-loader'>&nbsp;&nbsp;&nbsp;&nbsp;Procesando...</div><br/>");
                    subirArchivos();
                }); 
                

               var tipo=null
               for (var i=0;i<tiposDocumentoJSON.length;i++){
                   tipo=tiposDocumentoJSON[i];               
                   cargarCombo(tipo.nombre, tipo.lstEstadoDocumentoDTO, null, "idestadodocumento", "nombre");
               }
            })
            
        
            
            
        </script>
    </jsp:attribute>
    <jsp:body>
        <spring:message code="comun.todos" var="todosLabel" />
        <div class="group-panel" id="panelDatos">
            <fieldset>
            <form name="formulario" id="formulario" method="post" action="accion">
                
                    <div class="hd">Datos</div>
                    <div class="bd">
                       
                        <table class="filtrosTable" >
                            <!--<tr>
                                <th class="filtrosLabelWidth">Monto de abono</th>
                                <td>
                                    <input name="monto 1" type="text" maxlength="30" cssClass="longInputWidth" />
                                </td>
                             
                            </tr>
                            <tr>
                                <th class="filtrosLabelWidth">Monto de pago final</th>
                                <td>
                                    <input name="monto 2" type="text" maxlength="30" cssClass="longInputWidth" />
                                </td>
                             
                            </tr>-->
                            <c:forEach items="${lstInputs.inputs}"  var = "p">                     
                                <tr>
                                    <c:if test="${!p.documento}">
                                    <th class="filtrosLabelWidth">${p.nombre}</th>
                                    <td>
                                        <input name="${p.nombre}" type="text" maxlength="30" cssClass="longInputWidth" />
                                    </td>
                                    </c:if>
                                </tr>                            
                            </c:forEach>
                        </table> 
                    </div>                           
            </form>
            <form id="cargarArchivoForm" enctype="multipart/form-data" method="post" action="load">
                <div class="mhd">Documentos</div>
                <div class="bd">
                    <table class="filtrosTable" >
                    <c:forEach items="${lstInputs.inputs}"  var = "p">                     
                        <tr>                            
                            <c:if test="${p.documento}">
                            <th class="filtrosLabelWidth">${p.nombre}</th>
                            <td>
                                <input name="files['${p.nombre}']" type="file" maxlength="30" cssClass="longInputWidth" />
                            </td>
                            <td>
                                <select name="${p.nombre}" id="${p.nombre}"></select>
                            </td>
                            </c:if>
                        </tr>
                    </c:forEach>
                    </table>    
                    <!--<button type="button" id="btnCargar" class="floatRight" >
                        Cargar
                    </button>-->
                </div>
            </form>
            <div id="divButton" class="filtrosButtons floatRight">
                <button type="button" id="btnAceptar" class="rojo">
                    <spring:message code="comun.aceptar" />
                </button>
            </div>    
            </fieldset>
        </div>
                            
        <div class="group-panel" id="panelResultados" style="display: none">
            <fieldset>
                <div class="hd">Resultados</div>
                <div class="bd">
                    <div id="resultado"></div>
                </div>
            </fieldset>
        </div>

    </jsp:body>
</mac:layoutPopup>